<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script type="module">
      /*
          import 导入
          1. 定义变量名映射导出变量名
          2. * 星号全部导入，必须要使用as语法，定义一个对象，被导出的变量，将以对象属性的方式保存在这个对象中，后续可以通过对象语法访问导出的值，优点：导入时无需知道导出变量名

          export 导出
          1. 只要在变量、类、函数前加上关键字export即可
          2. 导出和变量定义分离（不推荐使用），缺点是无法直观看出哪个变量被导出，单词容易拼错
         
          import as
          1. 别名（定义变量名），作用：当默认映射的变量和其他变量定义重复时，使用as给导入映射变量重新起个变量名。
          2. 如果别名存在，访问导入值只能使用别名变量，之前的默认导入映射变量名失效。

          export as
          1. 只能在分离导出时使用
          2. 可以在导出时替换默认导出变量名，导入时候以替换后的变量名为准，默认导出变量名失效
        */
    </script>
    <script type="module">
      import { age as birth, info as user, uname } from "./m3.js";
      // 变量重定义
      let age = 30;
      console.log(age, birth);
    </script>
  </body>
</html>
